<?php
require_once("./db/conn.php");
include('./headers.php');

// 获取 course_id（假设从 URL 参数获取）
$course_id = $_GET['course_id'];

// 获取用户的 ID（假设从 cookies 中获取）
$user_id = $_COOKIE['user_id'];
$get_stu_id = "SELECT stu_id FROM student WHERE user_id = '$user_id'";
$stu_id_result = mysqli_query($conn, $get_stu_id);
$student_id = mysqli_fetch_assoc($stu_id_result)['stu_id'];

// 处理“参与课程”按钮的点击事件
if ($_SERVER['REQUEST_METHOD'] == 'POST' && isset($_POST['enroll'])) {
    // 检查用户是否已经加入该课程
    $check_enrollment = "SELECT * FROM learn WHERE stu_id = '$student_id' AND course_id = '$course_id'";
    $check_result = mysqli_query($conn, $check_enrollment);

    if (mysqli_num_rows($check_result) == 0) {
        // 如果没有加入课程，则添加记录
        $enroll_sql = "INSERT INTO learn (stu_id, course_id) VALUES ('$student_id', '$course_id')";
        if (mysqli_query($conn, $enroll_sql)) {
            echo "<script>alert('成功加入课程！'); window.location.href = 'index.php?course_id=$course_id';</script>";
        } else {
            echo "<script>alert('加入课程失败，请重试。');</script>";
        }
    } else {
        echo "<script>alert('您已加入此课程。');</script>";
        echo "<script>window.location.href = 'index.php?course_id=$course_id';</script>";
    }
}

// 查询课程信息
$sql = "SELECT course_name, start_time, end_time, course_intro, teacher_id FROM course WHERE course_id = '$course_id'";
$result = mysqli_query($conn, $sql);

// 处理课程信息
if (mysqli_num_rows($result) > 0) {
    $course = mysqli_fetch_assoc($result);
    $course_name = $course['course_name'];
    $start_time = $course['start_time'];
    $end_time = $course['end_time'];
    $course_intro = $course['course_intro'];
    $teacher_id = $course['teacher_id'];

    // 查询教师信息
    $sql = "SELECT name, src, intro FROM teacher WHERE teacher_id = '$teacher_id'";
    $result = mysqli_query($conn, $sql);

    // 处理教师信息
    if (mysqli_num_rows($result) > 0) {
        $teacher = mysqli_fetch_assoc($result);
        $teacher_name = $teacher['name'];
        $teacher_src = $teacher['src'];
    } else {
        echo "教师信息不存在";
        exit;
    }
} else {
    echo "课程不存在";
    exit;
}
?>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>课程详情</title>
    <link rel="stylesheet" type="text/css" href="/css/style.css">
    <link rel="stylesheet" type="text/css" href="/css/header.css">
</head>
<body>
    <div class="container">
        <div class="main">
            <div class="container1">
                <!-- 课程名称等 粗介绍 -->
                <div class="class">
                    <div class="cover">
                        <img src="assets/3f2b7b5e1ec547fcb4589f18e1a64d27.png" alt="">
                    </div>
                    <div class="c_int">
                        <div class="name">
                            <p><?php echo $course_name; ?></p>
                        </div>
                        <div class="time">
                            <p>开课时间： <?php echo $start_time; ?></p>
                        </div>
                        <div class="time">
                            <p>结课时间： <?php echo $end_time; ?></p>
                        </div>
                        <form method="post" action="">
                            <button type="submit" name="enroll">参与课程</button>
                        </form>
                    </div>
                </div>
            </div>
            <div class="container2">
                <div class="detail">
                    <div class="proclaim">
                        <span><?php echo $course_intro; ?></span>
                        <p>—— 课程团队</p>
                    </div>
                </div>
                <div class="teacher">
                    <div style="margin-top: 15px;margin-left: 15px;">
                        <p>授课教师</p>
                        <div class="t_inf">
                            <img src="<?php echo $teacher_src; ?>" alt="avatar">
                            <div style="display: flex; flex-direction: column; margin-left: 10px;;">
                                <span class="name"><?php echo $teacher_name; ?></span>
                                <span><?php echo $teacher['intro']; ?></span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
<script>
    // 可以在这里添加一些 JavaScript 代码
</script>
<style lang="scss" scoped>
    body {
        background-color: #f5f5f5;
        margin: 0;
        padding: 0;
    }

    .main {
        display: flex;
        flex-direction: column;
    }

    .header {
        display: flex;
        flex-direction: row;
        position: fixed;
        top: 0;
        width: 100%;
        background-color: #FFFFFF;
        height: 64px;
        align-items: center;

        .item {
            display: flex;
            margin-left: 20px;
            line-height: 64px;
            align-items: center;

            span {
                font-size: 16px;
                color: #333333;
                margin-left: 20px;
                margin-left: 3vw;
                font-weight: bold;
            }
        }

        .plat_name {
            font-size: 24px;
            color: #333333;
            margin-left: 20px;
            font-weight: bold;
            margin-left: 10vw;
        }

        .personality {
            margin-left: 25vw;
            font-size: 16px;
        }

        .avatar {
            margin-top: 30px;
            margin-left: 30px;
            width: 50px;
            height: 50px;
            border-radius: 100%;
        }
    }

    .container1 {
        display: flex;
        .class {
            display: flex;
            flex-direction: row;
            width: 70vw;
            background-color: #FFFFFF;
            min-height: 368px;
            padding: 16px 20px;
            border-radius: 12px;

            img {
                width: 510px;
                height: 288px;
                margin: 30px;
                border-radius: 12px;
            }

            .c_int {
                display: flex;
                flex-direction: column;
                margin-top: 30px;
                margin-left: 30px;

                div {
                    margin-top: 5px;
                    margin-bottom: 5px;
                }

                .name {
                    p {
                        font-size: 28px;
                        color: #333333;
                        margin-bottom: 10px;
                        font-weight: bolder;
                    }
                }

                .time {
                    font-size: 22px;
                    color: #292929;
                }
            }

            button {
                margin-top: 50px;
                height: 48px;
                line-height: 48px;
                font-size: 16px;
                background-color: #00CC7E;
                border-color: #00CC7E;
                color: #FFFFFF;
                min-width: 192px;
                font-weight: 600;
                border-radius: 24px;
                padding: 0 12px;
            }
        }
    }

    .container2 {
        display: flex;
        flex-direction: row;
        margin-top: 5vh;

        .detail {
            background-color: #FFFFFF;
            border-radius: 12px;
            display: flex;
            flex-direction: column;
            padding: 30px;
            width: 50vw;

            .proclaim {
                padding-top: 30px;
                background-color: #F5F8F4;
                padding: 30px 30px 20px;
                margin-bottom: 48px;
                color: #333333;
                font-size: 15px;

                p {
                    margin-top: 20px;
                    float: right;
                    font-size: 15px;
                }
            }
        }

        .teacher {
            margin-left: 30px;
            width: 17vw;
            background-color: #FFFFFF;
            border-radius: 12px;
            display: flex;
            flex-direction: column;

            p {
                font-size: 24px;
                font-weight: bold;
            }

            .t_inf {
                margin-top: 20px;
                display: flex;
                flex-direction: row;

                img {
                    width: 60px;
                    height: 60px;
                    border-radius: 100%;
                }

                .name {
                    font-size: 24px;
                    font-weight: 600;
                }
            }
        }
    }
</style>
</html>
